<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<jsp:include page="../pageheader.jsp"/>

<div class="container"> 
    <div id="topicsDiv" class="list-group">
        <c:if test="${topics != null}">
            <c:forEach items="${topics}" var="topic">
                <a href="seetopic.html?id=${topic.getId()}" class="list-group-item">
                    <div class="row">
                        <div class="col-xs-9">
                            <h4 class="list-group-item-heading">${topic.getTitle()}
                                <c:if test="${topic.getPosts().size() != 0}">
                                    <span class="badge">${topic.getPosts().size()}</span>
                                </c:if>
                            </h4>
                        </div>
                        <div class="col-xs-3">
                            ${topic.getCreatedDate()}
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-xs-12">
                            <p class="list-group-item-text">${topic.getMessage()}</p>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-xs-12">
                            ${topic.getUser().getName()}
                        </div>
                    </div>
                </a>
            </c:forEach>
        </c:if>
    </div>

    <c:if test="${!isAdmin}">
        <form class="form-horizontal">
            <div class="form-group">
                <label for="topicTitleField" class="col-xs-12 col-sm-2">New topic title</label>
                <div class="col-xs-12 col-sm-10">
                    <input type="text" class="form-control" maxlength="100" id="topicTitleField" placeholder="New topic title" />
                </div>
            </div>
            <div class="form-group ">
                <label for="topicMessageField" class="col-xs-12 col-sm-2">New topic message</label>
                <div class="col-xs-12 col-sm-10">
                    <textarea class="form-control input-sm" maxlength="700" id="topicMessageField" placeholder="New topic message"></textarea>
                </div>
            </div>
            <div class="form-group">
                <div class="col-xs-12">
                    <button type="button" onclick="addPostClick()" class="btn btn-primary">Start new topic</button>
                </div>
            </div>
        </form>
    </c:if>
</div>

<jsp:include page="../pagefooter.jsp"/>